<template>
  <div class="list">
    <div class="body">
      <div class="logo">
        <van-image width="98" height="92" :src="img1" />
      </div>
      <div class="title">高校房产</div>
      <div class="login">
        <van-form @submit="onSubmit">
          <van-cell-group inset>
            <div>
              <van-field
                v-model="Obj.username"
                name="用户名"
                label="用户名"
                placeholder="请输入用户名/手机号/邮箱"
                :rules="[{ required: true, message: '请填写用户名' }]"
              />
            </div>
            <div style="display: flex">
              <van-field
                v-model="Obj.pwd"
                :type="passType"
                name="密码"
                label="密码"
                placeholder="请输入密码"
                :rules="[{ required: true, message: '请填写密码' }]"
              />
              <van-icon @click="openEye" class="eye" name="eye-o" />
              <van-icon @click="closeEye" class="eye" name="closed-eye" />
            </div>
          </van-cell-group>
          <div style="margin: 39px 16px">
            <van-button
              round
              block
              type="primary"
              native-type="submit"
              class="btn"
            >
              登 录
            </van-button>
          </div>
        </van-form>
        <div class="noPass">忘记密码</div>
      </div>
    </div>
  </div>
</template>
<script>
import CryptoJS from "crypto-js";
export default {
  data() {
    return {
      Obj: {},
      passType: "password",
      img1: require("../assets/images/logo.png"),
    };
  },
  methods: {
    onSubmit() {
      let params = this.Obj;
      //登陆
      this.$http.post("/nvwa/login", params).then(
        (res) => {
          if (res.token) {
            sessionStorage.setItem("token", res.token);
            //获取用户信息
            this.$http.get("nvwa/getLoginContext").then((res) => {
               if(res.code == 0){
                this.Obj = {}
                sessionStorage.setItem("userInfo", JSON.stringify(res.context));
                this.$router.push("/");
               }
            });
          }
        },
        (error) => {
          this.$toast({
            msg: error,
            type: "fail",
          });
        }
      );
    },
    openEye() {
      this.passType = "text";
    },
    closeEye() {
      this.passType = "password";
    },
    goModel() {
      this.$toast({
        msg: "成功提示",
        type: "success",
      });
    },
  },
};
</script>

<style scoped lang="less">
.list {
  height: 100vh;
  width: 100%;
  .body {
    .logo {
      padding-top: 121px;
    }
    .title {
      margin-top: 26px;
      font-size: 28px;
      font-weight: 500;
      color: #333333;
    }
    .login {
      margin-top: 89px;
    }
  }
  .eye {
    line-height: 50px;
    margin-right: 10px;
    height: 24px;
    width: 24px;
  }
  .btn {
    background: linear-gradient(135deg, #5b88fb 0%, #3e58ed 100%);
  }
  .noPass {
    font-size: 16px;
    font-weight: 400;
    color: #7f7f7f;
  }
}
</style>
